[iOS 9] UIStackViewでAndroidのView.GONEを実装する
はじめに
こんにちは!加藤潤です。
これまでこちらにあるように条件によって特定のビューの表示/非表示を切り替える場合、 非表示にした場合にその分のスペースを詰めたり、逆に表示した場合にスペースを空ける等の処理はConstraintを2つ用意して差し替えたり、少々トリッキーなやり方でやっていました。 Android Developerの方は「View.GONEがあれば。。。」と思ったに違いありません。
しかしiOS 9で追加されたUIStackViewを使えばViewのhiddenを切り替えるだけでView.GONEの動きが出来ちゃいます。今回はその方法をご紹介します。
開発環境
開発環境は以下の通りです。
- Xcode 7.0.1
- iPhone 6sシミュレータ
ビューの配置 & 制約の追加
今回はUISwitchと2つのUITextViewを配置し、UISwitchのON/OFFで先頭のUITextViewの表示/非表示を切り替えます。
まずはStoryboard上で下記のようにUISwitchと2つのUITextViewを貼り付けます。 わかりやすいようにUITextViewには背景色、テキストを設定します。
この時点でUISwitchに以下の制約を追加します。
- Leading Space to: Superview
- TopSpace to: Top Layout Guide Equals: 20
続いて2つのUITextViewをUIStackViewで包みましょう。 下記のように2つのUITextViewを選択した状態で「Stack」をクリックします。
すると下記のように選択したUITextViewがUIStackViewで包まれます。
この状態だとAutolayoutの制約が不足しているのでエラーとなります。 下記の制約を追加してください。
- 1番目のUITextViewにHeight Equals: 100を設定
- 2番目のUITextViewにHeight Equals: 200を設定
- UIStackViewにTrailing Space to Superviewを設定
- UIStackViewにLeading Space to Superviewを設定
- UIStackViewにTop Space to: Switch Equals 20を設定
コーディング
ここまででビューを配置して制約の設定が終わったので後はコーディングするだけです。 とは言っても簡単で、下記のように1番目のUITextViewのアウトレットとUISwitchの値変更アクションメソッドを実装します。 アクションメソッドの中で1番目のUITextViewのhiddenを切り替えるだけです。
class ViewController: UIViewController { // 1番目のテキストビュー @IBOutlet weak var firstTextView: UITextView! // UISwitchの変更イベント @IBAction func didChangeValue(sender: UISwitch) { UIView.animateWithDuration(0.3) { () -> Void in self.firstTextView.hidden = !sender.on } } }
動作確認
実行結果は下記の通りです。
まとめ
UIStackViewを使って簡単にAndroidのView.GONEを実装する方法をご紹介しました。 今回ご紹介した内容はUIStackViewを使った例の1つに過ぎません。 iOS 9から追加されたUIStackViewをどんどん活用していきましょう!!